import React, { Component } from 'react'
// import store from '../../redux/store'
// import {createDecrementAction,createIncrementAction,createIncrementAsyncAction} from '../../redux/count_action'
export default class Count extends Component {
    // Count私有的state
    state = {}
    // componentDidMount() {//store中数据发生改变，但是视图不一定会改变
    //     store.subscribe(() => {
    //         this.setState({})//虚晃一枪“改变state”,使得render刷新
    //     });
    // }
    // 加法
    increment = () => {
        const { value } = this.selectNumber;
        // store.dispatch({ type: 'increment', data: value * 1 })
        // store.dispatch(createIncrementAction(value*1));
        this.props.jia(value*1);
    }
    // 减法
    decrement = () => {
        const { value } = this.selectNumber;
        // store.dispatch({ type: 'decrement', data: value * 1 })
        // store.dispatch(createDecrementAction(value*1));
        this.props.jian(value*1);
    }
    // 当前求和为奇数再加
    incrementIfOdd = () => {
        const { value } = this.selectNumber;
        const count = this.props.count;
        if (count % 2 !== 0) {
            this.props.jia(value*1);
        }
    }
    // 异步加
    incrementAsync = () => {
        const { value } = this.selectNumber;
        // setTimeout(()=>{
            // store.dispatch(createIncrementAsyncAction(value*1,500));
        // },500)
        this.props.jiaAsync(value*1,2000);

    }
    render() {
        // console.log("UI组件",this.props);
        return (
            <div>
                <h1>当前求和：{this.props.count}</h1>
                <select ref={c => this.selectNumber = c}>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                </select>&nbsp;
                <button onClick={this.increment}>+</button>&nbsp;
                <button onClick={this.decrement}>-</button>&nbsp;
                <button onClick={this.incrementIfOdd}>当前求和为奇数再加</button>&nbsp;
                <button onClick={this.incrementAsync}>异步加</button>&nbsp;

            </div>
        )
    }
}
